import type { Directive, DirectiveBinding } from 'vue'
import { useUserStore } from '@/stores/user'

/**
 * 权限指令
 * 用法：
 * v-permission="'user:add'" - 检查单个权限
 * v-permission="['user:add', 'user:edit']" - 检查多个权限（或关系）
 * v-permission:all="['user:add', 'user:edit']" - 检查多个权限（且关系）
 */
export const permission: Directive = {
    mounted(el: HTMLElement, binding: DirectiveBinding) {
        checkPermission(el, binding)
    },
    updated(el: HTMLElement, binding: DirectiveBinding) {
        checkPermission(el, binding)
    }
}

function checkPermission(el: HTMLElement, binding: DirectiveBinding) {
    const { value, arg } = binding
    const userStore = useUserStore()

    // 如果没有用户信息，隐藏元素
    if (!userStore.userInfo) {
        hideElement(el)
        return
    }

    // 超级管理员拥有所有权限
    if (userStore.isSuperAdmin) {
        showElement(el)
        return
    }

    let hasPermission = false

    if (Array.isArray(value)) {
        // 多个权限
        if (arg === 'all') {
            // 且关系：需要拥有所有权限
            hasPermission = value.every(permission => userStore.hasPermission(permission))
        } else {
            // 或关系：拥有任意一个权限即可
            hasPermission = value.some(permission => userStore.hasPermission(permission))
        }
    } else if (typeof value === 'string') {
        // 单个权限
        hasPermission = userStore.hasPermission(value)
    }

    if (hasPermission) {
        showElement(el)
    } else {
        hideElement(el)
    }
}

function hideElement(el: HTMLElement) {
    // 保存原始display样式
    if (!el.dataset.originalDisplay) {
        el.dataset.originalDisplay = el.style.display || ''
    }
    el.style.display = 'none'
}

function showElement(el: HTMLElement) {
    // 恢复原始display样式
    const originalDisplay = el.dataset.originalDisplay || ''
    if (originalDisplay === 'none') {
        el.style.display = ''
    } else {
        el.style.display = originalDisplay
    }
}

/**
 * 超级管理员权限指令
 * 用法：v-super-admin - 只有超级管理员才能看到
 */
export const superAdmin: Directive = {
    mounted(el: HTMLElement, binding: DirectiveBinding) {
        checkSuperAdminPermission(el, binding)
    },
    updated(el: HTMLElement, binding: DirectiveBinding) {
        checkSuperAdminPermission(el, binding)
    }
}

function checkSuperAdminPermission(el: HTMLElement, _binding: DirectiveBinding) {
    const userStore = useUserStore()

    // 如果没有用户信息，隐藏元素
    if (!userStore.userInfo) {
        hideElement(el)
        return
    }

    // 只有超级管理员才能看到
    if (userStore.isSuperAdmin) {
        showElement(el)
    } else {
        hideElement(el)
    }
}

export default permission